<form class="form-horizontal" role="form" id="edit-selector">

	<div class="form-group">
		<label for="selectorId" class="col-lg-1 control-label">字段名称</label>

		<div class="col-lg-10">
			<input type="text" class="form-control" name="id" id="selectorId" placeholder="字段名称" value="{{selector.id}}">
		</div>
	</div>

	<div class="form-group">
		<label for="type" class="col-lg-1 control-label">字段类型</label>

		<div class="col-lg-10">
			<select class="form-control" id="type" name="type">
				{{#selectorTypes}}
				<option value="{{type}}">{{title}}</option>
				{{/selectorTypes}}
			</select>
		</div>
	</div>

	<div class="form-group">
		<label for="selector" class="col-lg-1 control-label">选择器</label>

		<div class="col-lg-10">
			<div class="input-group">
				  <span class="input-group-btn">
					<button class="btn btn-default" action="select-selector" type="button">点击选择</button>
					<button class="btn btn-default" action="preview-selector" type="button" data-toggle="button">显示元素</button>
					<button class="btn btn-default" action="preview-selector-data" type="button">数据预览</button>
				  </span>
				<input type="text" class="form-control selector-value" id="selector" name="selector" value="{{selector.selector}}">
			</div>
		</div>
	</div>

	<div class="form-group feature feature-clickElementSelector">
		<label for="clickElementSelector" class="col-lg-1 control-label">详情页选择器</label>

		<div class="col-lg-10">
			<div class="input-group">
				  <span class="input-group-btn">
					<button class="btn btn-default" action="select-selector" type="button">点击选择</button>
					<button class="btn btn-default" action="preview-click-element-selector" type="button" data-toggle="button">显示元素</button>
				  </span>
				<input type="text" class="form-control selector-value" id="clickElementSelector" name="clickElementSelector" value="{{selector.clickElementSelector}}">
			</div>
		</div>
	</div>

	<!-- tableHeaderSelector -->
	<div class="form-group feature feature-tableHeaderRowSelector">
		<label for="tableHeaderRowSelector" class="col-lg-1 control-label">标题行选择器</label>
		<div class="col-lg-10">
			<div class="input-group">
				  <span class="input-group-btn">
					<button class="btn btn-default" action="select-table-header-row-selector" type="button">点击选择</button>
					<button class="btn btn-default" action="preview-table-row-selector" type="button" data-toggle="button">显示元素</button>
				  </span>
				<input type="text" class="form-control selector-value" id="tableHeaderRowSelector" name="tableHeaderRowSelector" value="{{selector.tableHeaderRowSelector}}">
			</div>
		</div>
	</div>

	<!-- tableRowSelector -->
	<div class="form-group feature feature-tableDataRowSelector">
		<label for="tableDataRowSelector" class="col-lg-1 control-label">数据行选择器</label>
		<div class="col-lg-10">
			<div class="input-group">
				  <span class="input-group-btn">
					<button class="btn btn-default" action="select-table-data-row-selector" type="button">点击选择</button>
					<button class="btn btn-default" action="preview-table-row-selector" type="button" data-toggle="button">显示元素</button>
				  </span>
				<input type="text" class="form-control selector-value" id="tableDataRowSelector" name="tableDataRowSelector" value="{{selector.tableDataRowSelector}}">
			</div>
		</div>
	</div>

	<!-- ClickType -->
	<div class="form-group feature feature-clickType">
		<label for="clickType" class="col-lg-1 control-label">点击类型</label>

		<div class="col-lg-10">
			<select class="form-control" id="clickType" name="clickType">
				<option value="clickOnce">翻页 (ajax请求暂时不支持)</option>
				<option value="clickMore">加载更多 (ajax请求暂时不支持)</option>
			</select>
		</div>
	</div>

	<!-- clickElementUniquenessType -->
	<div class="form-group feature feature-clickElementUniquenessType">
		<label for="clickElementUniquenessType" class="col-lg-1 control-label">点击元素(唯一)</label>
		<div class="col-lg-10">
			<select class="form-control" id="clickElementUniquenessType" name="clickElementUniquenessType">
				<option value="uniqueText">文本</option>
				<option value="uniqueHTMLText">HTML+文本</option>
				<option value="uniqueHTML">HTML</option>
				<option value="uniqueCSSSelector">CSS 选择器</option>
			</select>
		</div>
	</div>

	<div class="form-group feature feature-multiple">
		<div class="col-lg-offset-1 col-lg-10">
			<div class="checkbox">
				<label>
					<input type="checkbox" name="multiple" {{#selector.multiple}}checked="checked"{{/selector.multiple}}> 多元素
				</label>
			</div>
		</div>
	</div>

	<!-- discardInitialElements -->
	<div class="form-group feature feature-discardInitialElements">
		<div class="col-lg-offset-1 col-lg-10">
			<div class="checkbox">
				<label>
					<input type="checkbox" name="discardInitialElements" {{#selector.discardInitialElements}}checked="checked"{{/selector.discardInitialElements}}>
					不保留点击元素
				</label>
			</div>
		</div>
	</div>

	<!-- downloadImage -->
	<div class="form-group feature feature-downloadImage">
		<div class="col-lg-offset-1 col-lg-10">
			<div class="checkbox">
				<label>
					<input type="checkbox" name="downloadImage" {{#selector.downloadImage}}checked="checked"{{/selector.downloadImage}}> 下载图片
				</label>
			</div>
		</div>
	</div>

	<div class="form-group feature feature-next-page">
		<label for="pageUrl" class="col-lg-1 control-label">翻页url</label>
            <div class="col-lg-6">
			  	<input type="text" class="form-control" name="pageUrl" id="pageUrl" placeholder="翻页url" value="{{selector.pageUrl}}">
			</div>
			<div class="col-lg-2">
			  	<input type="text" class="form-control" name="startNum" id="startNum" placeholder="起始页数" value="{{selector.startNum}}">
			</div>
			<div class="col-lg-2">
			  	<input type="text" class="form-control" name="endNum" id="endNum" placeholder="终止页数" value="{{selector.endNum}}">
			</div>
	</div>

	<div class="form-group feature feature-regex">
		<label for="regex" class="col-lg-1 control-label">正则过滤</label>

		<div class="col-lg-10">
			<input type="text" class="form-control" name="regex" id="regex" placeholder="正则过滤" value="{{selector.regex}}">
		</div>
	</div>

	<div class="form-group feature feature-extractAttribute">
		<label for="extractAttribute" class="col-lg-1 control-label">属性名称</label>

		<div class="col-lg-10">
			<input type="text" class="form-control" name="extractAttribute" id="extractAttribute" placeholder="属性名称" value="{{selector.extractAttribute}}">
		</div>
	</div>

	<div class="form-group feature feature-delay">
		<label for="delay" class="col-lg-1 control-label">采集间隔(毫秒)</label>

		<div class="col-lg-10">
			<input type="text" class="form-control" name="delay" id="delay" placeholder="间隔" value="{{selector.delay}}">
		</div>
	</div>

	<div class="form-group">
		<label for="parentSelectors" class="col-lg-1 control-label">父容器</label>

		<div class="col-lg-10">
			<select multiple class="form-control" id="parentSelectors" name="parentSelectors">
				{{#selectorIds}}
				<option value="{{.}}">{{.}}</option>
				{{/selectorIds}}
			</select>
		</div>
	</div>

	<div class="form-group feature feature-columns">
		<label class="col-lg-1 control-label">表格列属性</label>

		<div class="col-lg-10">
			<table class="table table-bordered table-condensed">
				<thead>
					<tr>
						<th>列名</th>
						<th>自定义key</th>
						<th>包括自定义key</th>
					</tr>
				</thead>
				<tbody>
					{{#selector.columns}}
					<tr>
						<td><input class="column-header" type="hidden" name="column[header][]" value="{{header}}">{{header}}</td>
						<td><input class="column-name form-control" type="text" name="column[name][]" value="{{name}}"></td>
						<td><input class="column-extract" type="checkbox" name="column[extract][]" {{#extract}}checked="checked"{{/extract}}></td>
					</tr>
					{{/selector.columns}}
				</tbody>
			</table>
		</div>
	</div>

	<div class="form-group">
		<div class="col-lg-offset-1 col-lg-10">
			<button class="btn btn-primary" action="save-selector">保存选择器</button>
            <button action="cancel-selector-editing" class="btn btn-default">取消</button>
		</div>
	</div>

	<div class="form-group">
		<div class="col-lg-offset-1 col-lg-10">

		</div>
	</div>
</form>